<%--
  Created by IntelliJ IDEA.
  User: LLg
  Date: 2022/11/21
  Time: 8:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户管理</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/layui/css/layui.css">
    <base href="${pageContext.request.contextPath}"/>
    <script src="${pageContext.request.contextPath}/statics/layui/layui.js"></script>
</head>
<body>
<script type="text/html" id="switchTpl">
    <input type="checked" name="sex" value="{id.id}" lay-skin="switch" lay-text="开启|禁用" lay-filter="sexDemo" {{ d.status == 1 ? 'checked' : ''}}>
</script>
    <form class="layui-form" action="">
    <div style="margin-top: 25px">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">登录名称：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="login_name" id="login_name" autocomplete="off">
                </div>
            </div>

            <%--            搜索--%>
            <div class="layui-inline">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
                </div>
            </div>
            <%--            新增按钮--%>
            <script type="text/html" id="toolbarDemo">
                <div class="layui-btn-container">
                    <button class="layui-btn layui-btn-sm" lay-event="add">新增</button>
                </div>
            </script>
            <table class="layui-hide" id="test" lay-filter="test"></table>


            <div>
                <script type="text/html" id="barDemo">
                    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                </script>
            </div>
        </div>
    </div>
</form>
</script>
<script>
    layui.use(['table', 'form', 'jquery'], function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.$;
        var tableIns = table.render({
            elem: '#test'
            , toolbar: '#toolbarDemo'
            , url: '${pageContext.request.contextPath}/sysUser/SelectYongHu'
            , cols: [[
                {field: 'userId',title: '用户Id'}
                , {field: 'loginName',title: '登录名称'}
                , {field: 'userName',title: '用户名称'}
                , {field: 'userType',title: '部门'}
                , {field: 'phonenumber',title: '手机',}
                , {field: 'status',title: '用户状态',templet: '#switchTpl'}
                , {field: 'createTime',title: '创建时间'}
                , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 300}
            ]]
            , page: true
        });

        //监听状态操作
        form.on('switch(sexDemo',function (obj){
            $.get("${pageContext.request.contextPath}/sysUser/status",{id:this.value,status:(obj.elem.checked)?1:0},function (data){
                console.log(data)
                if (data){
                    layer.msg((obj.elem.checked ? "启用":"禁用")+"成功",{icon:1,time:1000})
                }else {
                    layer.msg((obj.elem.checked ? "启用":"禁用")+"失败",{icon:2,time:1000})
                }
            })
        })

        //监听工具事件
        table.on('tool(test)', function (obj) {

            var data = obj.data.user_id
            //console.log(obj)
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                    $.get("${pageContext.request.contextPath}/sysUser/delete/"+data, function (data) {
                        if (data) {
                            layer.msg("删除成功",function (){
                                location.reload();
                            });
                        } else {
                            alert('删除失败')
                        }
                    })
                    layer.close(index);
                });
            } else if (obj.event === 'view') {
                window.open("sysUser/view/" + data.user_id)
            } else if (obj.event === 'edit') {
                var index = layer.open({
                    title: '编辑用户',
                    type: 2,
                    shade: 0.2,
                    maxmin: true,
                    shadeClose: true,
                    area: ['100%', '100%'],
                    data: {
                        obj: obj.data
                    },
                    content: ["${pageContext.request.contextPath}/sysUser/update/" + data]
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            }
        });

        // 工具栏事件
        table.on('toolbar(test)', function (obj) {
            let event = obj.event;
            if (event === "add") {
                parent.layer.open({
                    type: 2,
                    title: '新增',
                    area: ["70%", "100%"],
                    maxmin: true,
                    offset: '100px',
                    content: '${pageContext.request.contextPath}/sysUser/toAdd',
                })
            }
            return false
        });

    });
</script>
</body>
</html>
